<template>
	<view class="epoxydateil">
		<view class="dateil-margin">
			<view class="entrust-share">
				<view class="" style="display: flex;justify-content: space-between;align-items: center;">
					<view class="smalBox"></view>
					<view class="text-name " style="margin-left: 10rpx;" @click="clickToast">
						<!-- 名称 -->
						<text>{{epxyDateil.epPrjName}}<text
								style="margin-left: 20rpx;">{{epxyDateil.shipType}}</text></text>
					</view>
				</view>
				<!-- 红色的小盒子 -->
				<button @click="appShare(epxyDateil)" size="mini" type="default" open-type="share" class="button-share">
					<image src="http://106.14.56.171:15016/images/prjdetail/u02.png" />
				</button>
			</view>
			<view class="entrust-dateil">
				<view class="iswagua" @click="alsoXygen(epxyDateil.coverPicUrl)">
					<fileImage :src="epxyDateil.coverPicUrl_T" :className="['inCidental']" />
				</view>
				<view class="dateil-info">
					<!-- 派工单号 -->
					<view>
						<text class="textA">派工单号</text>
						<text class="marginA">{{epxyDateil.planCode}}</text>
					</view>
					<!-- 服务类型 -->
					<view>
						<text class="textA">服务类型</text>
						<text class="marginA">船舶环氧</text>
					</view>
					<!-- 施工设备 -->
					<view>
						<text class="textA">施工设备</text>
						<text
							class="marginA">{{epxyDateil.eppEpEpoxyProjectPlanFacilityData.facilityName || '暂无数据'}}</text>
					</view>
				</view>

			</view>
			<!-- 最新进度 -->
			<view class="speed-progress" @click="clickSpeeds">
				<view class="speed-left">
					<view class="speed-name">最新进度</view>
					<view class="icon-left">
						<uni-icons class="margin-left" type="right" size="14" />
					</view>
				</view>
				<view class="speed-left speed-left-color">
					<view class="speed-name">
						<uni-icons type="flag-filled" size="18" color="#008000" />
						{{epxyDateil.statusText}}
					</view>
					<view class="icon-left" v-if="epxyDateil.status == 1">
						<text>{{epxyDateil.workPersonCount}}人</text>
						<text class="margin-left">正在施工中</text>
					</view>
				</view>
				<view class="speed-left">
					<view class="speed-name">
						预计交付：{{epxyDateil.endTime}}
					</view>
				</view>
			</view>
		</view>
		<view class="dateil-margin">
			<view class="name-td">基本信息</view>
			<!-- 业主方 -->
			<view class="BasicMation">
				<text>业主方</text>
				<view class="unitMation">
					<text>{{epxyDateil.ownersName}}</text>
					<text>{{epxyDateil.eppEpEpoxyProjectContacts&&epxyDateil.eppEpEpoxyProjectContacts.find(v=>v.contactsType === 3)&&epxyDateil.eppEpEpoxyProjectContacts.find(v=>v.contactsType === 3).phoneList.map(v=>v.name).toString()}}</text>
				</view>
			</view>

			<!-- 委托方 -->
			<view class="BasicMation">
				<text>委托方</text>
				<view class="unitMation">
					<text>{{epxyDateil.companyBuyer}}</text>
					<text>{{epxyDateil.eppEpEpoxyProjectContacts&&epxyDateil.eppEpEpoxyProjectContacts.find(v=>v.contactsType === 1)&&epxyDateil.eppEpEpoxyProjectContacts.find(v=>v.contactsType === 1).phoneList.map(v=>v.name).toString()}}</text>
				</view>
			</view>

			<!-- 服务方 -->
			<view class="BasicMation">
				<text>服务方</text>
				<view class="unitMation">
					<text>{{epxyDateil.companySeller}}</text>
					<text>{{epxyDateil.epPrjTeamLeader}}</text>
				</view>
			</view>
			<!-- 施工人员 -->
			<view class="baDge" @click="clickBadge(epxyDateil)">
				<text>施工人员</text>
				<text>{{epxyDateil.userName}}</text>
				<image src="http://106.14.56.171:15016/images/idPhoto.png" />
			</view>
		</view>
		<view class="dateil-margin">
			<view class="fiad">
				<view class="name-td name-td-flex">
					<text>项目材料</text>
				</view>
				<!-- 材料名称 -->
				<view>
					<text class="ajakvb">材料</text>
					<text class="agentSice">{{epxyDateil.materialName&& epxyDateil.materialName.toUpperCase()}}</text>
				</view>
				<!-- 用量单位 -->
				<view style="margin-top: 20rpx;" v-if="epxyDateil.epSurplus!=0">
					<text class="ajakvb">用量</text>
					<text class="agentSice">{{epxyDateil.epSurplus}}套</text>
				</view>

			</view>
		</view>
		<view class="dateil-margin" v-if="deviceInfoLeength>0 || entrceTrue">
			<!-- 温湿度曲线获取设备 -->
			<view class="name-td name-td-flex entrStyle" @click="entrance">
				<text> 温湿度曲线获取设备<text  v-if="deviceInfoLeength>0">（{{deviceInfoLeength}}）</text></text>
				<image src="http://106.14.56.171:15016/images/u3063.png" mode="" />
			</view>
		</view>
		<view class="dateil-margin">
			<!--施工图片  -->
			<view>
				<view class="name-td">施工图片</view>
				<view class="image-construction" v-if="showImg">
					<view class="flex-construction" :class="index == 3 ? 'flex-construction-total':''"
						v-for="(item,index) in planImgList" :key="item.imgId" @click="clickPreview(index)">
						<fileImage :src="item.filePath_T" :className="['const-ruction']" />
						<view class="text-image" v-if="index == 3" @click.stop="clickImgDateil">
							<view class="total-vertical-align">
								共{{planIndex}}张
								<uni-icons type="forward" size="12" color="#fff" />
							</view>
						</view>
						<view class="video-icon" v-if="item.fileShow && index != 3">
							<view>
								<uni-icons type="videocam" size="40" color="#fff"></uni-icons>
							</view>
						</view>
					</view>
				</view>
				<view class="no-data-text noneData" v-if="!showImg">
					<image src="http://106.14.56.171:15016/images/images(4)(1)/images/noMessige.png" mode=""></image>
					<text>暂无数据...</text>
				</view>
			</view>
		</view>
		<view class="dateil-margin">
			<!-- 施工数据 -->
			<view v-if="mapShow" style="margin-top: 40rpx;">
				<view class="name-td namrsd" @click="clickSpeed">
					<text>施工数据</text>
					<view class="moresa">
						<text>更多数据</text>
						<uni-icons class="margin-left" type="right" size="14" />
					</view>
				</view>
				<view class="video" v-for="item in planMapList" :key="item.mpFile" @click="e => clickMapFile(item)">
					<uni-icons class="videocam-border" type="videocam" size="50" />
					<view class="video-info">
						<view class="name-video">{{item.fileName}}</view>
						<view class="name-key-color">{{item.createTime}}</view>
					</view>
				</view>
			</view>
			<!-- 施工报告 -->
			<view style="margin-top: 40rpx;" v-if="fileShow">
				<view class="name-td namrsd">项目附件</view>
				<block>
					<view class="video file-report" v-for="item in planFileList" :key="item.accId"
						@click="e => clickFile(item)">
						<image class="videocam-border videocam-border-image"
							src="http://106.14.56.171:15016/images/prjdetail/u17.png" />
						<view class="video-info">
							<view class="name-video">{{item.fileName}}</view>
							<view class="name-key-color">
								{{item.createTime?item.createTime.replace(/-/g, '/').replace('T',' ').slice(0,16):''}}
							</view>
						</view>
					</view>
				</block>
				<!-- 原设计图、船级社审核图、COA、环氧技术协议 -->
				<view class="basic-info basic-info-image" v-if="fileShow">
					<view class="image-cation" v-for="(item,index) in fileList" :key="item.filePath"
						@click="clickFile(item)">
						<view class="timeImages">
							<image :src="item.images" />
							<view class="">
								<text>{{item.name}}</text>
								<text>{{item.createTime?item.createTime.replace(/-/g, '/').replace('T',' ').slice(0,16):''}}</text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 视频弹窗 -->
		<uni-popup ref="popup" @change="changeMapFile">
			<video class="uni-popup-video" autoplay enable-play-gesture id="myVideo" :src="videoFileUrl" controls
				@error="fileMapError" />
		</uni-popup>
		<!-- 图片浏览 -->
		<previewImage ref="previewImage" :imgdefault="imgsList"></previewImage>
		<!-- 环氧评论 -->
		<!-- <view class="comment-padding" @click="clickMent">
			<view>
				<image src="./../../static/commnts.png" mode="" />
				<text>评论信息{{' '}}
					<text v-if="commentLength!=''">{{commentLength}}{{' '}}条</text>
				</text>
			</view>
			<image src="http://106.14.56.171:15016/images/u3063.png" />
		</view> -->
	</view>
</template>

<script>
	import {
		CurrentRouter,
		timeSplice,
		uniShareMethod
	} from '@/config/CurrentRouter.js';
	import fileImage from '@/components/fileImage/fileImage.vue';
	import previewImage from '@/components/previewImage/previewImage.vue';
	import {
		getNowTime
	} from './timeModeth';
	import {
		Desensitized
	} from '@/config/desensitization.js';
	import {
		baseMethod
	} from '@/config/method.js';
	export default {
		data() {
			return {
				entrceTrue: true,
				deviceName: '', //获取项目温湿度设备
				deviceInfoLeength: '', //获取项目温湿度设备数量
				commentLength: '', //评论信息数据
				erpId: '', //环氧详情ID
				planId: '', // 环氧详情数据id
				epxyShow: false, // 展开船舱
				epxyDateil: {
					epPrjTeamLeader: '',
					eppEpEpoxyProjectPlanFacilityData: {
						facilityName: ''
					},
					eppEpEpoxyProjectContacts: []
				}, // 环氧详情数据
				planIndex: 0, // 当前图片数量
				planImgList: [], // 施工图片数据
				showImg: true, // 判断施工图片是否为空
				planFileList: [], // 施工报告数据
				fileShow: true, // 判断施工报告是否为空
				planMapList: [], // 施工数据数据
				mapShow: true, // 判断施工数据是否为空
				videoFileUrl: '', // 视频文件
				videoContext: null, // 视频播放实例
				imgsList: [], // 预览图片
				fileList: [], // 其他类型附件 附件类型 1原设计图 2船级社退审图 3COA 4环氧技术协议  5环氧工艺  6封面照片 7环氧报告  8 TDS附件
			}
		},
		components: {
			fileImage,
			previewImage
		},
		// 微信分享个人
		onShareAppMessage(options) {
			const {
				coverPicUrl,
				epPrjName
			} = this.epxyDateil
			return {
				title: epPrjName,
				path: `/pages/epoxyfile/epoxydateil?epPrjId=${this.erpId}&planId=${this.planId}`,
				imageUrl: coverPicUrl
			}
		},
		// 微信分享到朋友圈
		onShareTimeline(options) {
			const {
				coverPicUrl,
				epPrjName
			} = this.epxyDateil
			return {
				title: epPrjName,
				query: `/pages/epoxyfile/epoxydateil?epPrjId=${this.erpId}&planId=${this.planId}`,
				imageUrl: coverPicUrl
			}
		},
		onLoad(option) {
			// console.log(option)
			if (!option.epPrjId) {
				uni.navigateBack({
					delta: 1
				})
				return
			}
			this.status = option.status
			console.log(this.status)
			this.erpId = option.epPrjId
			this.planId = option.planId
			this.epoxyProject()
			this.epoxyPlanImg()
			this.epoxyPlanFile()
			this.epoxyPlanMap()
		},
		methods: {
			// #ifdef APP-PLUS || H5
			appShare(epxyDateil) {
				uniShareMethod({
					path: `pages/epoxyfile/epoxydateil?epPrjId=${this.erpId}&planId=${this.planId}`,
					share: {
						imageUrl: epxyDateil.coverPicUrl_T,
						title: epxyDateil.epPrjName,
					}
				}).then(res => {}).catch(err => {})
			},
			// #endif
			/**
			 * 时间： 2022/8/15，An
			 * 功能： 环氧项目详情
			 * 接口:  'api/EpoxyProject/GetEpoxyProjectPlanInfo'
			 * 参数： epPrjId-->id环氧id,planId--> // 环氧详情数据id
			 */
			epoxyProject(data, item, index) {
				this.$http.get(`api/EpoxyProject/GetEpoxyProjectPlanInfo?epPrjId=${this.erpId}&planId=${this.planId}`)
					.then(res => {
						if (uni.getStorageSync("accessToken")) {
							this.tempEquipment(res.epPrjCode); //温湿度曲线获取设备
							this.entrceTrue = false;
						}
						if (!res) return
						if (Array.isArray(res.eppEpEpoxyProjectContacts) && res.eppEpEpoxyProjectContacts.length > 0) {
							let listCode = []
							res.eppEpEpoxyProjectContacts.forEach(code => {
								if (code.contactsType < 5) {
									listCode.push(code)
								}
							})
							res.eppEpEpoxyProjectContacts = listCode
						}
						if (Array.isArray(res.eppEpEpoxyProjectContacts) && res.eppEpEpoxyProjectContacts.length > 0) {
							// 电话数据
							let phoneLIst = {} //
							res.eppEpEpoxyProjectContacts.forEach(code => {
								let typeCode = phoneLIst[code.contactsType]
								if (typeCode) phoneLIst[code.contactsType].push({
									name: Desensitized.desensitizedName(code.contactsName),
									phone: code.contactsTel,
									type: code.contactsType
								})
								else phoneLIst[code.contactsType] = [{
									name: Desensitized.desensitizedName(code.contactsName),
									phone: code.contactsTel,
									type: code.contactsType
								}]
								// console.log(phoneLIst)
							})
							// console.log(res, 'aaa');
							let peiectLIst = []
							for (let key in phoneLIst) {
								let codePeject = res.eppEpEpoxyProjectContacts.find(code => code.contactsType == key)
								if (codePeject) {
									codePeject = {
										...codePeject,
										phoneList: phoneLIst[key],
										...addressFunction(codePeject)
									}
									peiectLIst.push(codePeject)
								}
							}
							res.eppEpEpoxyProjectContacts = peiectLIst
							// console.log(peiectLIst, 'aaaaa');
							// 不同类型的地址数据
							function addressFunction(code) {
								// '委托方'
								if (code.contactsType == 1) return {
									addAaddress: res.companyBuyer,
									shipNameMap: '委托方'
								}
								else return {
									addAaddress: '***',
									shipNameMap: '***'
								}
							}
						}
						// 开工时间
						res.beginTime = res.beginTime ? timeSplice(res.beginTime, 1, '/') : ''
						// 预计交付时间
						res.endTime = res.endTime ? timeSplice(res.endTime, 1, '/') : ''
						// 
						res.logtime = res.logtime ? timeSplice(res.logtime, 1, '/') : ''
						// 项目状态
						res.statusText = statusText()
						// 施工状态 0待施工 1施工中 2浇筑完成 3预约报验 4待签字 5报验完成 6暂停
						function statusText() {
							// console.log(res.status, '============')
							// '待施工'
							if (res.status == 0) return '待施工'
							// '施工中 '
							else if (res.status == 1) return '施工中'
							// '浇筑完成 '
							else if (res.status == 2) return '浇筑完成'
							// '预约报验 '
							else if (res.status == 3) return '预约报验'
							// '待签字 '
							else if (res.status == 4) return '待签字'
							// '报验完成 '
							else if (res.status == 5) return '报验完成'
							// '暂停'
							else if (res.status == 6) return '暂停'
							else return '***'
						}
						// 处理项目封面 防止接口异步处理，详情接口重新赋值并且丢失
						res.coverPicUrl = res.coverPicUrl ? res.coverPicUrl : ''
						res.epPrjTeamLeader = res.epPrjTeamLeader ? Desensitized.desensitizedName(res
							.epPrjTeamLeader) : ''
						this.epxyDateil = res
						console.log('-=-=-==-', this.epxyDateil);
						uni.setNavigationBarTitle({
							title: res.epPrjName
						});
					}).catch(err => {})
			},
			/**
			 * 时间： 2022/8/16，An
			 * 功能： 派工单图册
			 * 接口:  'api/EpoxyProject/EpoxyProjectPlanImgsList'
			 * 参数： planId-->派工单id
			 */
			epoxyPlanImg() {
				this.$http.get(`api/EpoxyProject/EpoxyProjectPlanImgsList?planId=${this.planId}`).then(res => {
					// console.log(res);
					if (!Array.isArray(res) || res.length <= 0) {
						this.showImg = false
						// for (let i = 0; i < 4; i++) {
						// 	this.planImgList.push({
						// 		imgId: `img-${i}`,
						// 		filePath_W: '',
						// 		filePath_T: '',
						// 	})
						// }
						return
					}
					// 预览图片
					this.imgsList = res.map(code => code.filePath_W)
					// 当期图片的数量
					this.planIndex = res.length
					if (res.length >= 3) {
						let imgList = []
						this.planImg = res.forEach((item, index) => {
							if (index <= 3) imgList.push({
								...item,
								fileShow: fileType(item.filePath_W),
							})
						})
						this.planImgList = imgList
					} else {
						this.planImgList = res.map((code) => {
							return {
								...code,
								fileShow: fileType(code.filePath_W),
							}
						})
					}

					function fileType(code) {
						let num = -1
						let list = ['mp4', 'webm', 'ogg']
						list.forEach(item => {
							if (code.indexOf(item) != -1) {
								num++
							}
						})
						return num == -1 ? false : true
					}
				}).catch(err => {})
			},
			/**
			 * 时间： 2022/8/16，An
			 * 功能： 派工单附件 附件类型 1原设计图 2船级社退审图 3COA 4环氧技术协议  5环氧工艺  6封面照片 7环氧报告  8 TDS附件
			 * 接口:  'api/EpoxyProject/EpoxyProjectPlanFileList'
			 * 参数： planId-->派工单id
			 */
			epoxyPlanFile() {
				this.$http.get(`api/EpoxyProject/EpoxyProjectPlanFileList?planId=${this.planId}`).then(res => {
					console.log('原设计图、船级社审核图、COA、环氧技术协议', res)
					if (!Array.isArray(res) || res.length <= 0) {
						this.fileShow = false
						this.fileList = [{
							images: 'http://106.14.56.171:15016/images/prjdetail/u17.png',
							name: '原设计图',
							filePath: '',
							createTime: ''
						}, {
							images: 'http://106.14.56.171:15016/images/prjdetail/u17.png',
							name: '船级社审核图',
							filePath: '',
							createTime: ''
						}, {
							images: 'http://106.14.56.171:15016/images/prjdetail/u17.png',
							name: 'COA',
							filePath: '',
							createTime: ''
						}, {
							images: 'http://106.14.56.171:15016/images/prjdetail/u17.png',
							name: '环氧技术协议',
							filePath: '',
							createTime: ''
						}, ]
						return
					}
					// 施工报告 accType == 7
					let reportList = []
					// 其他
					let fileList = []
					res.forEach(code => {
						console.log(code)
						// 封面图片信息 
						// if (code.accType == 6) this.epxyDateil.coverPicUrl = code.filePath
						if (code.accType == 7) {
							reportList.push({
								...code,
								createTime: code.createTime ? timeSplice(code.createTime) :
									timeSplice(getNowTime()),
								name: fileName(code.accType)
							})
						} else {
							fileList.push({
								...code,
								createTime: code.createTime ? timeSplice(code.createTime) :
									timeSplice(getNowTime()),
								name: fileName(code.accType)
							})
						}
					})
					console.log('reportList, fileList', reportList, fileList)
					// 施工报告
					this.planFileList = reportList
					// 其他类型
					this.fileList = fileList

					function fileName(code) {
						// '原设计图'
						if (code == 1) return '原设计图'
						// '船级社退审图'
						else if (code == 2) return '船级社退审图'
						// 'COA'
						else if (code == 3) return 'COA'
						// '环氧技术协议'
						else if (code == 4) return '环氧技术协议'
						// '环氧工艺'
						else if (code == 5) return '环氧工艺'
						// '封面照片'
						else if (code == 6) return '封面照片'
						// '环氧报告'
						else if (code == 7) return '环氧报告'
						// 'TDS附件'
						else if (code == 7) return 'TDS附件'
						else return '***'
					}
					// console.log(this.planFileList)
				}).catch(err => {})
			},
			/**
			 * 时间： 2022/8/16，An
			 * 功能： 派工单报验视频
			 * 接口:  'api/EpoxyProject/EpoxyProjectPlanMp4List'
			 * 参数： planId-->派工单id
			 */
			epoxyPlanMap() {
				this.$http.get(`api/EpoxyProject/EpoxyProjectPlanMp4List?planId=${this.planId}`).then(res => {
					if (!Array.isArray(res) || res.length <= 0) {
						this.mapShow = false
						return
					}
					console.log(res, '--------------------')
					this.planMapList = res.map(code => {
						return {
							...code,
							createTime: code.createTime ? timeSplice(code.createTime, 1, '/') : timeSplice(
								getNowTime())
						}
					})
					this.videoContext = uni.createVideoContext('myVideo'); //创建视频实例指向video
				}).catch(err => {})
			},
			// 点击播放视频
			clickMapFile(item) {
				// console.log(item)
				if (!item.filePath_W) {
					uni.showToast({
						title: '没有视频信息',
						icon: 'none'
					})
					return
				}
				this.videoFileUrl = item.filePath_W
				this.$refs.popup.open()
			},
			// 打开弹窗或者关闭弹窗的时候
			changeMapFile(item) {
				// console.log(item)
				if (item.show) this.videoContext.play(); //播放 
				else this.videoContext.pause(); //暂停
			},
			// 点击甘特图
			clickChart() {
				uni.navigateTo({
					url: `/pages/epoxyfile/gantchart?code=${this.erpId}&name=${this.epxyDateil.epPrjName}&type=1`
				})
			},
			//  点击施工报告
			// #ifdef H5
			clickFile(item) {
				uni.showToast({
					title: '请到app或小程序进行查看，暂不支持此功能',
					icon: 'none'
				});
			},
			// #endif
			// #ifdef APP-PLUS || MP-WEIXIN
			clickFile(item) {
				if (!item.filePath) {
					uni.showToast({
						title: '没有附件',
						icon: 'none'
					})
					return
				}
				uni.showLoading({
					title: '加载中···',
					mask: true,
					icon: 'loading'
				})
				uni.downloadFile({
					url: item.filePath,
					success: function(res) {
						var filePath = res.tempFilePath;
						uni.openDocument({
							filePath: filePath,
							showMenu: true,
							success: function(res) {
								uni.hideLoading()
							},
							fail: function() {
								uni.hideLoading()
								uni.showToast({
									title: '文件打开失败',
									icon: 'error'
								})
							}
						});
					},
					fail: function() {
						uni.hideLoading()
						uni.showToast({
							title: '附件下载失败',
							icon: 'error'
						})
					}
				});
			},
			// #endif
			// 点击环氧进度：项目进度
			clickSpeeds() {
				// console.log('-----------');
				const {
					planId,
					eppEpEpoxyProjectPlanFacilityData,
					epPrjName
				} = this.epxyDateil
				uni.navigateTo({
					url: `/pages/epoxyfile/pasedata?planId=${planId}&facilityName=${eppEpEpoxyProjectPlanFacilityData.facilityName}&epPrjName=${epPrjName}&repair=1`
				})
			},
			// 点击环氧进度：施工数据
			clickSpeed() {
				// console.log('-----------');
				const {
					planId,
					eppEpEpoxyProjectPlanFacilityData,
					epPrjName
				} = this.epxyDateil
				uni.navigateTo({
					url: `/pages/epoxyfile/pasedata?planId=${planId}&facilityName=${eppEpEpoxyProjectPlanFacilityData.facilityName}&epPrjName=${epPrjName}&repair=2`
				})
			},
			// 点击委托单号
			clickToast() {
				uni.showToast({
					title: '请到 App 查看',
					icon: 'none'
				})
			},
			// 委托方展开或者收起
			clickClose() {
				this.epxyShow = !this.epxyShow
			},
			// 点击贡多图片
			clickImgDateil() {
				if (this.planIndex <= 3) {
					uni.showToast({
						title: '没有更多图片啦',
						icon: 'none'
					})
					return
				}
				uni.navigateTo({
					url: `/pages/project/project_img/project_album?id=${this.planId}&code=1&name=${this.epxyDateil.epPrjName}-图库`
				})
			},
			// 预览图片
			clickPreview(index) {
				// console.log('0000')
				this.clickImgDateil()
				// this.$refs.previewImage.open(index)
			},
			alsoXygen(coverPicUrl) {
				console.log('epxyDateil.coverPicUrl', coverPicUrl);

				if (!coverPicUrl) {
					uni.showToast({
						title: '暂无图片',
						icon: 'none'
					})
					return;
				}
				uni.previewImage({
					current: 0,
					urls: [coverPicUrl]
				})

			},
			// 视频出错回调
			fileMapError(e) {
				// #ifndef H5 || APP-PLUS || MP-ALIPAY
				console.log(e)
				uni.showToast({
					title: '视频出错',
					icon: 'none'
				})
				// #endif
			},
			// 打电话
			telephone(code) {
				console.log(code)
			},
			// 查看工作证
			clickBadge(epoxyDateil) {
				// console.log('查看工作证', epoxyDateil.userId);
				uni.navigateTo({
					url: 'idphoto?userId=' + epoxyDateil.userId
				});
			},
			// 环氧评论入口
			clickMent() {
				let userCode = CurrentRouter({})
				if (userCode) return
				const {
					epPrjId,
					planCode
				} = this.epxyDateil
				uni.navigateTo({
					url: `/pages/epoxyfile/epoxyComment?epPrjId=${epPrjId}&planCode=${planCode}`
				})
			},
			// 获取评论信息几条数据
			comMentDateil() {
				this.$http.get(`api/Project/GetProjectComment?prjInfoId=${this.getDelit.id}`).then(res => {
					this.commentLength = res.length
					// console.log(this.commentLength, 1116);
				})
			},
			/**
			 * 时间：2023/04/04
			 * 功能：温湿度曲线获取设备
			 * 接口：api/PrjHumitureDevice/GetPrjHumitureDeviceInfo ZX22030248
			 */
			tempEquipment(epPrjCode) {
				let data = {
					prjCode: epPrjCode
				}
				this.$http.get('api/PrjHumitureDevice/GetPrjHumitureDeviceInfo', data).then((res => {
					this.deviceName = res;
					this.deviceInfoLeength = res.length
					console.log(this.deviceInfoLeength, '获取项目温湿度设备');
				}))
			},
			// 温湿度曲线入口
			entrance() {
				let userCode = CurrentRouter({})
				if (userCode) return
				let enList = JSON.stringify(this.deviceName);
				uni.navigateTo({
					url: '/pages/project/project_detail/entrance?item=' + enList
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.epoxydateil {
		margin: 10rpx 20rpx;
		padding-bottom: 40rpx;

		.dateil-margin {
			border-radius: 10rpx;
			background-color: #fff;
			padding: 10rpx;
			// background-color: aquamarine;

			.name-td {
				font-size: 30rpx;
				font-weight: 600;
				position: relative;
				padding-left: 20rpx;
				margin-bottom: 20rpx;
			}

			.name-td::after {
				content: '';
				position: absolute;
				background-color: #b6001f;
				left: 0;
				top: 8rpx;
				width: 12rpx;
				height: 28rpx;
			}
		}

		.dateil-margin+.dateil-margin {
			margin-top: 10rpx;
		}

		.button-share {
			background-color: #fff;
			line-height: normal;
			padding: 0;
			font-size: 30rpx;
			margin: 0;

			image {
				margin-left: 7px;
				width: 17px;
				height: 17px;
			}
		}

		.button-share::after {
			border: none;
		}

		.no-data-text {
			text-align: center;
		}

		// 暂无数据
		.noneData {
			display: flex;
			align-items: center;
			flex-direction: column;
			justify-content: space-around;

			>image {
				width: 92rpx;
				height: 92rpx;
			}

			>text {
				margin-top: 20rpx;
				font-size: 26rpx;
			}
		}

		.margin-left {
			margin: 0 10rpx;
		}

		.name-td-flex {
			display: inline-flex;

			.material-text {
				margin-left: 10rpx;
			}


		}

		.entrStyle {
			width: 95%;
			// padding: 10px 0 10px 0;
			// border: 1px solid red;
			justify-content: space-between;
			align-items: center;

			>image {
				width: 10px;
				height: 15px;
			}
		}

		.fiad {
			padding: 0 0 20rpx 0;
			width: 95%;
			margin: auto;
			background-color: #fff;
			display: flex;
			flex-direction: column;
			justify-content: space-around;

			.ajakvb {
				font-size: 28rpx;
				color: #666;
			}

			.agentSice {
				font-size: 28rpx;
				margin-left: 15rpx;
			}
		}

		.name-key-color {
			font-size: 26rpx;
			color: #666;
		}

		.entrust-share {
			display: flex;
			justify-content: space-between;
			align-items: center;

			.smalBox {
				background-color: #b6001f;
				width: 12rpx;
				height: 28rpx;
			}

			.text-name {
				font-weight: bold;
				font-size: 30rpx;

				.under-line {
					text-decoration: underline;
					color: #2c66a8;
					font-size: 26rpx;
				}
			}
		}

		.speed-progress {
			padding: 10rpx 20rpx;
			background-color: #f5f4f5;
			border-radius: 10rpx;
			margin: 30rpx 0;
			font-size: 28rpx;

			.speed-left {
				display: flex;
				justify-content: space-between;
				align-items: center;
			}

			.speed-left-color {
				color: #008000;
			}

			.speed-left-time {
				color: #b7b7b7;
			}

			.speed-left+.speed-left {
				margin-top: 10rpx;
			}
		}

		// 派工单号\项目号\业主方\委托方\服务方
		.entrust-dateil {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 20rpx;
			font-size: 22rpx;
			// background-color: red;

			.dateil-info {
				width: 70%;
				height: 150rpx;
				// background-color: aqua;
				display: flex;
				align-items: center;
				flex-direction: column;
				justify-content: space-around;

				>view {
					margin-left: 45rpx;
					width: 480rpx;
					font-size: 26rpx;

					// background-color: aqua;
					.textA {
						color: #666;
					}

					.marginA {
						margin-left: 22rpx;
					}
				}
			}

			.chart-image {
				width: 26rpx;
				height: 26rpx;
			}
		}

		.namrsd {
			display: flex;
			justify-content: space-between;

			// background-color: aqua;
			.moresa {
				font-weight: 400;
				font-size: 26rpx;
			}
		}

		.BasicMation {
			width: 95%;
			margin: auto;
			margin-top: 20rpx;
			display: flex;
			// background-color: aqua;

			>text {
				color: #666;
				font-size: 26rpx;
			}

			.unitMation {
				width: 85%;
				margin-left: 2%;
				// background-color: red;
				display: flex;
				flex-direction: column;
				justify-content: space-around;

				>text {
					font-size: 26rpx;
				}
			}
		}

		.baDge {
			width: 95%;
			margin: auto;
			margin-top: 20rpx;
			display: flex;
			align-items: center;
			font-size: 26rpx;
			// background-color: aqua;

			>text:nth-child(1) {
				color: #666;
			}

			>text:nth-child(2) {
				margin-left: 20rpx;
			}

			>image {
				margin-left: 20rpx;
				width: 32rpx;
				height: 30rpx;
			}
		}

		.basic-info {
			display: flex;
			font-size: 28rpx;
			padding-bottom: 10rpx;

			.basic-key {
				width: 110rpx;
				margin-left: 24rpx;
				white-space: nowrap;
				position: relative;
			}

			.basic-pdf-image {
				position: absolute;
				right: -20px;
				width: 30rpx;
				height: 30rpx;
			}

			.basic-value {
				margin-left: -43rpx;
				width: 100%;
				flex: 1;
				position: relative;
			}

			.open-collect {
				position: absolute;
				right: 0;
				top: 0;
			}

			.name-phone {
				display: flex;
				flex-wrap: wrap;
				width: 80%;

				.text-phone {
					margin: 0 20rpx 0 0;
				}
			}
		}

		.basic-info+.basic-info {
			border-top: 2rpx solid #f6f6f6;
		}

		.basic-info-image {
			// background-color: aqua;
			display: flex;
			flex-direction: column;
			justify-content: space-around;

			.image-cation {
				margin: auto;
				width: 93%;
				margin-bottom: 20rpx;
				// background-color: aqua;

				.timeImages {
					display: flex;

					>image {
						width: 60rpx;
						height: 60rpx;
					}

					>view {
						display: flex;
						flex-direction: column;
						width: 200rpx;
						margin-left: 20rpx;

						// background-color: #008000;
						>text {
							font-size: 26rpx;
						}
					}
				}
			}
		}

		.image-construction {
			display: flex;
			justify-content: space-between;
			margin: 10rpx 0 0 20rpx;

			.flex-construction-total {
				position: relative;

				.text-image {
					position: absolute;
					color: #fff;
					font-size: 24rpx;
					width: 150rpx;
					height: 150rpx;
					top: 0;
					z-index: 99;
				}

				.total-vertical-align {
					vertical-align: middle;
					display: table-cell;
					text-align: center;
					width: 150rpx;
					height: 150rpx;
					background-color: rgba(51, 51, 51, .6);
					border-radius: 10rpx;
				}
			}
		}

		.flex-construction {
			position: relative;
		}

		.video-icon {
			position: absolute;
			top: 0;
			z-index: 99;
			position: absolute;
			width: 211rpx;
			height: 211rpx;

			view {
				vertical-align: middle;
				display: table-cell;
				text-align: center;
				width: 150rpx;
				height: 150rpx;
				background-color: rgba(51, 51, 51, .6);
				border-radius: 10rpx;
			}
		}


		.video {
			display: flex;
			margin: 0 0 0 20rpx;
			align-items: center;

			.videocam-border {
				border-radius: 10rpx;
				border: 2rpx solid #f6f6f6;
			}

			.videocam-border-image {
				width: 60rpx;
				height: 60rpx;
			}

			.video-info {
				margin: 10rpx 0 0 10rpx;
			}
		}

		.iswagua {
			width: 200rpx;
			height: 200rpx;
			border-radius: 10rpx;

			>image {
				width: 200rpx;
				height: 200rpx;
				border-radius: 10
			}
		}
	}

	/deep/.uni-list-item {
		border-radius: 15rpx;
		padding-left: -30rpx;
	}

	.comment-padding {
		width: 100%;
		margin: auto;
		margin-top: 20rpx;
		background-color: #fff;
		border-radius: 15rpx;
		display: flex;
		align-items: center;
		flex-direction: row;
		justify-content: space-between;

		view {
			width: 260rpx;
			height: 80rpx;
			display: flex;
			align-items: center;
			justify-content: space-around;
			font-size: 26rpx;
		}

		>image {
			margin-right: 30rpx;
			width: 10rpx;
			height: 20rpx;
		}

		>view:nth-child(1) {
			>image {
				width: 45rpx;
				height: 45rpx;
			}
		}
	}
</style>
<style lang="scss">
	.epoxydateil {
		line-height: normal;

		.inCidental {
			width: 200rpx;
			height: 200rpx;
			border-radius: 10rpx;
		}

		.const-ruction {
			width: 150rpx;
			height: 150rpx;
			margin-right: 10rpx;
			border-radius: 10rpx;
		}
	}

	.name-video {
		font-size: 26rpx;
	}

	.uni-popup__wrapper {
		.uni-popup-video {
			border-radius: 10rpx;
			height: 400rpx;
		}
	}
</style>